<template>
  <zm-panel :visible.sync="value" @change="closeAfter" class="panelContainer">
    <div slot="title">
      <div class="dib">{{ tableData.returnedNo }}{{ tableData.customerName }}</div>
      <tag-type
        :value="linkInfo.linkStatus || tableData.checkStatus"
        :msg="linkInfo.linkStatusMsg"
      />
    </div>
    <app-block v-if="isShowBtn && isFqAndSp && isShowApproveBtn" class="optionBtn">
      <div>
        <zm-button @click="onEdit" v-if="+linkInfo.isEdit&&isWaitMe==='1'" plain>
          编辑
        </zm-button>
        <!-- 工作台进去的 是否显示审批操作按钮 -->
        <template v-if="isApproval" class="vm">
          <template v-if="tableData.checkStatus === '1'">
            <zm-button @click="onRevocation" v-if="+linkInfo.isSponsor" plain type="info">
              撤销审批
            </zm-button>
            <zm-button
              @click="onApproved('0')"
              type="danger"
              v-if="+linkInfo.isAction && isHiddenApproveBtn"
              plain
            >
              审批驳回
            </zm-button>
            <zm-button @click="onApproved('1')" v-if="+linkInfo.isAction && isHiddenApproveBtn" plain type="success">
              审批通过
            </zm-button>
          </template>
          <zm-button @click="onSubmit" v-if="showBaseBtn" plain>
            提交审批
          </zm-button>
        </template>
      </div>
    </app-block>
    <app-block v-if="!loading">
      <zm-tabs :list="tabList" v-model="tabType" tab-type=""></zm-tabs>
      <component :ref="tabType" :is="tabType" :obj="tableData" :process-type="processType" :business-id="obj.id || id" @after-save="getInfo"></component>
    </app-block>
    <edit-invoice
      v-if="editParams.visible"
      v-model="editParams.visible"
      :obj="editParams.obj"
      :id="editParams.id"
      :is-approve="editParams.isApprove"
      @after-save="getInfo"
    ></edit-invoice>
    <div slot="footer" class="tr"></div>
    <approve-input
      v-model="showApproveDialog"
      v-if="showApproveDialog"
      @after-approve="afterApprove"
      ref="approveDialog"
      :type="approveObj.approveType"
    ></approve-input>
  </zm-panel>
</template>

<script>
import TagType from '@/components/TagType'
import panelMixin from '@/mixins/panelMixin'
import { checkStatus } from '../../const'
import { tabList } from './const'
import dataInfo from './dataInfo'
import Record from '@/views/approval/components/Record'
import RedDashedRecord from './RedDashedRecord.vue'
import EditInvoice from '../New'
import { delReturned, getInfo } from '@/api/src/returnedMoney'
import { getLinkStatus, submit, cancel, refuse, checkApprove } from '@/api/src/approve'
import { getBaseData } from '@/utils/store'
import approveMixin from '@/mixins/approveMixin'
import ApproveInput from '@/components/ApproveInput'

export default {
  components: { TagType, dataInfo, Record, EditInvoice, ApproveInput, RedDashedRecord },
  mixins: [panelMixin, approveMixin],
  props: {
    isShowBtn: {
      // 是否展示按钮
      type: Boolean,
      default: true
    },
    // 是否为工作台进入
    isApproval: {
      type: Boolean,
      default: false
    },
    isWaitMe: {
      type: String,
      default: '1'
    }
  },
  data () {
    return {
      checkStatus,
      tabType: 'dataInfo',
      form: {},
      tableData: {
        returnedNo: '',
        saleName: '',
        checkStatus: ''
      },
      linkInfo: { isEdit: '1' },
      editParams: {
        visible: false,
        obj: {}
      },
      processType: '7',
      loading: false,
      showApproveDialog: false
    }
  },
  computed: {
    tabList () {
      // 未提交没有审批记录
      if (this.tableData.checkStatus === '0') {
        return tabList().filter((i) => i.name !== 'Record')
      } else {
        return tabList()
      }
    },
    invoiceDesc () {
      const checkStatus = getBaseData().checkStatus
      return checkStatus.find(item => {
        return item.value === this.tableData.checkStatus
      })
    },
    isFqAndSp () {
      return this.tableData.checkStatus === '0'
        ? true
        : +this.linkInfo.isSponsor || +this.linkInfo.isApprove
    },
    showBaseBtn () {
      // 已拒绝 未提交 已退回
      return ['2', '0', '4'].includes(this.tableData.checkStatus) && +this.linkInfo.isSponsor
    },
    processTypeObj () {
      const list = getBaseData().processType
      return list.find(item => {
        return item.value === '7'
      }) // 回款录入审批
    }
  },
  async created () {
    this.getInfo()
  },
  methods: {
    async getInfo () {
      this.loading = true
      this.tableData = await getInfo({ id: this.obj.id || this.id })

      if (this.tableData.checkStatus === '0') {
        //  || this.tableData.checkStatus === '3'
        this.loading = false
        return
      } else {
        this.isShowBtn && this.getLinkStatus()
      }
      this.loading = false
    },
    async getLinkStatus () {
      this.linkInfo = await getLinkStatus({
        businessId: this.obj.id || this.id,
        processType: this.processTypeObj.value,
        linkName: this.processTypeObj.name,
        draftId: this.draftId
      })
    },
    onEdit () {
      this.editParams = {
        visible: true,
        obj: this.tableData,
        id: this.obj.id || this.id,
        isApprove: this.linkInfo.isApprove // 可审批 1是 0否
      }
    },
    onDel () {
      const text = '是否确认删除该回款记录?'
      this.$confirm(text, '删除', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(async () => {
          await delReturned({ id: this.obj.id || this.id })
          this.$message.success('删除成功')
          this.$emit('after-save')
          this.close()
        })
        .catch(() => {})
    },
    async onSubmit () {
      if (
        this.tableData.returnedType === '2' &&
        +this.tableData.balanceAmount + +this.tableData.residue > 0
      ) {
        this.$message.error('红冲金额输入错误')
        return
      }

      if (
        this.tableData.returnedType === '1' &&
        +this.tableData.returnedMoney > +this.tableData.residue - +this.tableData.approvalReturnedMoney
      ) {
        this.$confirm(
          '本期回款的金额已超过剩余金额减去冻结金额, 确定提交审批/保存?',
          '提示',
          {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }
        )
          .then(() => {
            this.onSubmitFunc()
          })
          .catch(() => {})
      } else {
        this.onSubmitFunc()
      }
    },
    async onSubmitFunc () {
      await checkApprove({processType: '7'})
      const params = {
        processType: '7', // 7->回款录入审批
        linkName: '销售单' + this.obj.saleOrderNo + '回款', // 审批标题
        businessId: this.obj.id || this.id // 关联的业务表id
      }
      await submit(params)
      this.$message.success('提交成功')
      this.$emit('after-save')
      this.close()
    },
    async onRevocation () {
      const params = {
        processType: '7', // 7->回款录入审批
        businessId: this.obj.id || this.id // 关联的业务表id
      }
      await cancel(params)
      this.$message.success('撤销成功')
      this.$emit('after-save')
      this.close()
    },
    onApproved (type) {
      this.approveObj.approveType = type
      this.approveObj.type = type
      this.approveObj.businessId = this.obj.id || this.id
      this.approveObj.processType = '7'
      this.showApproveDialog = true
    }
  }
}
</script>

<style scoped lang="stylus"></style>
